import React, { Component } from 'react'
import Header from '../../components/Header/Header'
import { reqregister } from '../../http/api'
import "./Register.less"



export default class Register extends Component {
  constructor(){
    super()
    this.state={
      user:{
        phone:"",
        nickname:"",
        password:""
      }
    }
  }
  changeUser(e,key){
    this.setState({
      user:{
        ...this.state.user,
        [key]:e.target.value
      }
    })
  }
   //注册逻辑
   register=()=>{
    reqregister(this.state.user).then(res=>{
      if(res.data.code==200){
        alert(res.data.msg)
        this.props.history.push("/login")
      }
    })
  }

  render() {
    let {user}=this.state
    return (
      <div>
        <Header register title="注册"></Header>

       <div className='box'>
       <div>手机号：<input type="text" value={user.phone} onChange={e=>this.changeUser(e,'phone')} /></div>
        <div>昵称：<input type="text" value={user.nickname} onChange={e=>this.changeUser(e,'nickname')}  /></div>
        <div>密码：<input type="text" value={user.password} onChange={e=>this.changeUser(e,'password')}  /></div>
        <button onClick={this.register}>注册</button>
       </div>
      </div>
    )
  }
}
